<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean"%>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>
<!DOCTYPE html>
<html:html lang="true">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><bean:message key="welcome.title" /></title>
<link
	href="css/mini3537.css?files=reset,common,form,standard,960.gs.fluid,simple-lists,block-lists,planning,table,calendars,wizard,gallery"
	rel="stylesheet" type="text/css">
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<link rel="icon" type="image/png" href="favicon-large.png">
<script type="text/javascript"
	src="js/miniab15.php?files=html5,jquery-1.4.2.min,old-browsers,jquery.accessibleList,searchField,common,standard,jquery.tip,jquery.hashchange,jquery.contextMenu,list"></script>
<html:base />
</head>
<body>
	<!-- *************************************** Content *************************************************** -->
	<section class="grid_9">
		<div class="block-border">
			<html:form styleClass="block-content form" action="room.do" styleId="room">
				<h1>List of Rooms</h1>
				<div class="block-controls">
					<label for="stats-period">Select Builts</label>
					<html:select name="RoomForm" property="idBuilt" styleId="builtRoom"
						onchange="selectBuilt(this)">
						<html:options collection="arrBuilt" property="id"
							labelProperty="name" />
					</html:select>
				</div>

				<div class="no-margin">
					<table class="table" cellspacing="0" width="100%">
						<thead>
							<tr>
								<th class="black-cell">No</th>
								<th scope="col">Room Name</th>
								<th scope="col">Floor</th>

								<th scope="col">Square</th>
								<th scope="col">Price</th>

								<th scope="col">Status</th>
								<th scope="col">Builts</th>
								<th scope="col" class="table-actions">Actions</th>

							</tr>
						</thead>

						<tbody>


							<logic:present name="RoomForm" property="arrRooms">
								<logic:iterate id="listRooms" name="RoomForm"
									property="arrRooms" indexId="index">
									<tr>
										<td><%=index.intValue() + 1%></td>
										<td><bean:write name="RoomForm" property='<%="arrRooms[" + index + "].name"%>' /> 
										<html:hidden name="RoomForm" property='<%="arrRooms[" + index + "].id"%>' styleId='<%="arrRooms[" + index + "].id"%>' /> 
										<html:hidden name="RoomForm" property='<%="arrRooms[" + index + "].name"%>' styleId='<%="arrRooms[" + index + "].name"%>' />
										<html:hidden name="RoomForm" property='<%="arrRooms[" + index + "].price"%>' styleId='<%="arrRooms[" + index + "].price"%>' />
										</td>
										<td><bean:write name="RoomForm" property='<%="arrRooms[" + index + "].floo"%>' /></td>
										<td><bean:write name="RoomForm" property='<%="arrRooms[" + index + "].square"%>' /></td>
										<td><bean:write name="RoomForm" property='<%="arrRooms[" + index + "].price"%>' /></td>
										<td><bean:write name="RoomForm" property='<%="arrRooms[" + index + "].status"%>' /></td>
										<td><bean:write name="RoomForm" property='<%="arrRooms[" + index + "].idBuilt"%>' />
											<html:hidden name="RoomForm" property='<%="arrRooms[" + index + "].idBuilt"%>' styleId='<%="arrRooms[" + index + "].idBuilt"%>' />
										</td>
										<td><a href="# " title="Detial" class="with-tip" onclick="selectRoom(<%=index.intValue()%>)">
										<img src="images/icons/fugue/tick-circle-blue.png" width="18" height="18"></a></td>
									</tr>
								</logic:iterate>
							</logic:present>

						</tbody>

					</table>
				</div>

				<ul class="message no-margin">
					<li>Results 1 - 5 out of 23</li>
				</ul>
			</html:form>
		</div>
	</section>
	<!-- *************************************** Content *************************************************** -->
	
</body>
</html:html>

<script type="text/javascript">
	function selectBuilt(control){
		var id = control.options[control.selectedIndex].value;	
		document.getElementById("room").action = 'room.do?method=findRoom&type=find&idBuilt=' + id;
		document.getElementById("room").submit();
		document.getElementById("room").action = 'room.do?method=getAllRoom';
	}
	
	function selectRoom(idRoom){
		var controlName = document.getElementById('arrRooms[' + idRoom + '].name');
			controrID = document.getElementById('arrRooms[' + idRoom + '].id');
			ControlBuilt = document.getElementById('arrRooms[' + idRoom + '].idBuilt');
			controlPrice = document.getElementById('arrRooms[' + idRoom + '].price');
			
		opener.document.ContractForm.nameRooms.value = controlName.value;
		opener.document.ContractForm.idRoom.value = controrID.value;
		opener.document.ContractForm.built.value = ControlBuilt.value;
		opener.document.ContractForm.singlPrice.value = controlPrice.value;
		
	self.close();
	}
</script>